﻿<template>
  <l-layout class="l-tab-page erpCase" v-if="!lr_loadPage">
    <l-panel v-if="!lookFormVisible">
      <template #title>
        <div>{{ $t("潜在供应商") }}</div>
        <div style="width: 560px">
          <div class="ml-8" style="float: right">
            <l-tool-btns
              :hasTableSetting="true"
              @setting="lr_handleSettingTable"
              @click="handleAdd()"
            >
              <l-excel-btns></l-excel-btns>
            </l-tool-btns>
          </div>
        </div>
      </template>
      <template #toolLeft>
        <l-query2
          :items="queryItems"
          :formData="queryData"
          :loading="tableLoading"
          @search="handleSearch"
        >
          <template #f_AssessState>
            <l-select
              :options="case_erp_supplier_f_AssessStateOptions"
              v-model="queryData.f_AssessState"
            />
          </template>
          <template #f_CreateDate>
            <!-- <l-date v-model="queryData.f_CreateDate" :placeholder="$t('请输入')" /> -->
            <el-date-picker
              v-model="queryData.f_CreateDate"
              type="daterange"
              range-separator="-"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
            >
            </el-date-picker>
          </template>
          <template #f_LatentState>
            <l-select
              :options="case_erp_supplier_f_FormalStateOptions"
              v-model="queryData.f_LatentState"
            />
          </template>
          <template #f_Type>
            <l-select
              :options="case_erp_supplier_f_TypeStateOptions"
              v-model="queryData.f_Type"
            />
          </template>
        </l-query2>
      </template>
      <l-table
        ref="mainTable"
        :loading="tableLoading"
        :columns="lr_getPageColumns(columns)"
        :dataSource="tableData"
        :isPage="true"
        :pageTotal="tableTotal"
        :tablePage.sync="tableCurrentPage"
        :key="Math.random()"
        @loadPageData="turnTablePage"
      >
        <template v-slot:f_TypeList="scope">
          <div class="form_information form_wrap">
            <div v-for="(item, index) in scope.row.f_TypeList" :key="index">
              <el-tag size="mini" class="margin_5" :type="tagType[item]">{{
                item
              }}</el-tag>
            </div>
          </div>
        </template>

        <l-table-btns
          :btns="tableBtns"
          :filterBtns="filterBtns"
          :isAuth="false"
          :btnNum="5"
          @click="lr_handleTableBtnClick"
        ></l-table-btns>
      </l-table>
    </l-panel>

    <!-- 风险评估 -->
    <transition name="el-zoom-in-center">
      <l-panel v-if="lookFormVisible">
        <template #title>
          <el-page-header @back="outBtn" :content="$t(show_name)" />
        </template>
        <!-- 风险评估、评估查看 -->
        <look-form
          v-if="['风险评估', '评估查看'].includes(show_name)"
          ref="lookForm"
          :isReadOnly="!lookFormEdit"
          :id="lookFormEditRow.f_Id"
          type="0"
          @submit="assessSubmit"
        ></look-form>

        <!-- 转正申请 -->
        <wf-create-form
          v-if="['转正申请'].includes(show_name)"
          ref="wfcreate"
          code="erp-supplier"
          wraperType="page"
          wfSubmitText="提交转正申请"
          :params="{
            id: supplierId,
            notAssess: notAssess,
          }"
          @refresh="assessSubmit"

          :wfNotShowWf="notAssess"
        />
      </l-panel>
    </transition>

    <!--表单-->
    <l-dialog
      :title="$t(formTitle)"
      :visible.sync="formVisible"
      :height="426"
      :width="487"
      @ok="handleSave"
      @close="handleCloseForm"
      @opened="handleOpenedForm"
    >
      <my-form ref="form" />
    </l-dialog>

    <wf-audit-form
      ref="form"
      type="auditAndlook"
      :params="{ loadProcessId: loadProcessId }"
      :isLoadFormData="true"
      title="审核查看"
      :visible.sync="wfvisible"
      @refresh="assessSubmit(true)"
    />
  </l-layout>
</template>

<script>
import MyForm from "./form";
import LookForm from "./lookForm";
const api = window.$api.erpcase.supplier;

export default {
  components: {
    MyForm,
    LookForm,
  },
  data() {
    return {
      lr_isPage: true,
      moduleCode: "ERP_Suppliers",

      tagType: {
        成品: "danger",
        半成品: "success",
        其他: "info",
        原料: "",
      },

      // 查询参数
      queryData: {
        f_AssessState: "",
        f_CreateDate: "",
        f_LatentState: "",
        f_Type: "",
      },
      // 表格参数
      tableLoading: false,
      tableData: [],
      tableTotal: 0,
      tableCurrentPage: 1,
      tablePageSize: 50,
      queryItems: [
        { label: "风险评估", prop: "f_AssessState" },
        { label: "添加时间", prop: "f_CreateDate" },
        { label: "状态", prop: "f_LatentState" },
        { label: "供应商类型", prop: "f_Type" },
      ],
      columns: [
        {
          label: "供应商编号",
          prop: "f_Number",
          align: "left",
          dataType: "guid",
          minWidth: 160,
          isNotAutoWrap: true,
        },
        {
          label: "供应商名称",
          prop: "f_Name",
          align: "left",
          minWidth: 200,
          isNotAutoWrap: true,
        },
        {
          label: "供应商负责人",
          prop: "f_Person",
          align: "left",
          width: 100,
        },
        {
          label: "手机号",
          prop: "f_Phone",
          align: "left",
          width: 120,
        },
        {
          label: "风险评估",
          prop: "f_AssessState",
          align: "left",
          dataType: "mydata",
          options: [
            { value: 0, label: "优秀" },
            { value: "1", label: "良好" },
            { label: "及格", value: "2" },
            { label: "不及格", value: "3" },
            { label: "未评估", value: "4" },
          ],
        },
        {
          label: "经营范围",
          prop: "f_Scope",
          align: "left",
        },
        {
          label: "添加时间",
          prop: "f_CreateDate",
          align: "left",
          dataType: "datetime",
          format: "yyyy-MM-dd",
          width: 100,
        },
        {
          label: "状态",
          prop: "f_LatentState",
          align: "left",
          dataType: "mydata",
          options: [
            { value: 0, label: "潜在" },
            { value: 1, label: "审批中" },
            { label: "不通过", value: 2 },
          ],
        },
        {
          label: "供应商类型",
          prop: "f_TypeList",
          align: "left",
          dataType: "dataItem",
          dataCode: "供应商类型",
          minWidth: 250,
        },
      ],
      tableBtns: [
        { prop: "Edit", label: "编辑", width: 64 },
        { prop: "Assess", label: "风险评估" },
        { prop: "AssessLook", label: "评估查看" },
        { prop: "Apply", label: "转正申请" },
        { prop: "Delete", label: "删除" },
      ],

      // 表单参数
      formVisible: false,
      formTitle: "",
      formEditRow: null,
      formEdit: false,

      // 风险评估
      lookFormVisible: false,
      lookFormTitle: "",
      lookFormEditRow: null,
      lookFormEdit: false,
      lookFormDetails: false,

      show_name: "",

      // 转正申请
      notAssess: false,

      wfvisible: false,
    };
  },
  computed: {
    case_erp_supplier_f_TypeStateOptions() {
      return [
        { label: "全部", value: "" },
        { value: "原料", label: "原料" },
        { value: "半成品", label: "半成品" },
        { label: "成品", value: "成品" },
        { label: "其他", value: "其他" },
      ];
    },
    case_erp_supplier_f_AssessStateOptions() {
      return [
        { label: "全部", value: "" },
        { value: "0", label: "优秀" },
        { value: "1", label: "良好" },
        { label: "及格", value: "2" },
        { label: "不及格", value: "3" },
        { label: "未评估", value: "4" },
      ];
    },
    case_erp_supplier_f_FormalStateOptions() {
      return [
        { label: "全部", value: "" },
        { value: "0", label: "潜在" },
        { value: "1", label: "审批中" },
        { value: "2", label: "不通过" },
      ];
    },
    supplierId() {
      return this.formEditRow ? this.formEditRow.f_Id : "";
    },
  },
  mounted() {
    this.init();
  },
  methods: {
    // 自定义按钮
    filterBtns(row, btns) {
      if (row.f_AssessState != 4) {
        btns.splice(1, 1);
      } else {
        btns.splice(2, 1);
      }

      if (row.f_LatentState == 1 || row.f_LatentState == 2) {
        btns[0].disabled = true;
        btns[2].label = "转正查看";
        btns[3].disabled = true;
      }

      return btns;
    },
    // 返回
    outBtn() {
      this.lookFormVisible = false;
    },
    init() {
      this.loadTableData();
    },

    handleSearch() {
      this.loadTableData();
    },
    turnTablePage({ rows }) {
      this.tablePageSize = rows;
      this.loadTableData(true);
    },
    async loadTableData(isNotFirst) {
      if (!isNotFirst) {
        this.tableCurrentPage = 1;
      }
      this.tableLoading = true;
      let queryData = this.$deepClone(this.queryData);
      if (queryData.f_CreateDate && queryData.f_CreateDate.length) {
        let data = []
        queryData.f_CreateDate.map (item=>{
          data.push(this.newDate(item))
        })
        this.$set(queryData, 'f_CreateDateQRange', data.join(" - "))
      }
      queryData.rows = this.tablePageSize;
      queryData.page = this.tableCurrentPage;
      queryData.sidx = "F_CreateDate DESC";
      queryData.f_State = 0;
      let data = await this.$awaitWraper(api.getPage(queryData));
      if (data != null) {
        for (let i in data.rows) {
          if (data.rows[i].f_Type) {
            data.rows[i].f_TypeList = data.rows[i].f_Type.split(",");
          } else {
            data.rows[i].f_TypeList = [];
          }
        }
        this.tableData = data.rows;
        this.tableTotal = data.records;
      } else {
        this.tableData = [];
      }
      this.tableLoading = false;
    },
    // 时间格式转化
    newDate(time) {
      var date = new Date(time)
      var y = date.getFullYear()
      var m = date.getMonth() + 1
      m = m < 10 ? '0' + m : m
      var d = date.getDate()
      d = d < 10 ? '0' + d : d
      return y + '-' + m + '-' + d
    },

    // 风险评估
    async handleAssess($index, row) {
      this.lookFormEdit = true;
      this.lookFormEditRow = row;
      this.lookFormVisible = true;
      this.show_name = "风险评估";
    },
    assessSubmit() {
      this.lookFormVisible = false;
      this.loadTableData();
    },

    // 评估查看
    async handleAssessLook($index, row) {
      this.show_name = "评估查看";
      this.lookFormEditRow = row;
      this.lookFormEdit = false;
      this.lookFormVisible = true;
    },

    //  转正申请
    handleApply($index, row) {
      if (row.f_LatentState == 1 || row.f_LatentState == 2) {
        this.notAssess = row.f_AssessState == 4;
        this.formEditRow = row;
        this.wfvisible = true;
      } else {
        this.show_name = "转正申请";
        this.notAssess = row.f_AssessState == 4;
        this.formEditRow = row;
        this.lookFormVisible = true;
      }
    },

    handleAdd() {
      this.formEdit = false;
      this.handleShowForm("新增");
    },
    handleEdit($index, row) {
      this.formEdit = true;
      this.formEditRow = row;
      this.handleShowForm("编辑");
    },

    handleDelete($index, row) {
      this.$confirm(
        this.$t("此操作将永久删除该数据, 是否继续?"),
        this.$t("提示"),
        {
          confirmButtonText: this.$t("确定"),
          cancelButtonText: this.$t("取消"),
          type: "warning",
        }
      )
        .then(async () => {
          this.tableData.splice($index, 1);
          this.tableTotal--;
          await api.remove(row.f_Id);
          this.$message({
            type: "success",
            message: this.$t("删除成功!"),
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: this.$t("已取消删除!"),
          });
        });
    },

    async handleSave(showLoading, hideLoading) {
      showLoading("保存数据中...");
      if (await this.$refs.form.validateForm()) {
        const res = await this.$refs.form.saveForm({
          keyValue: this.formEdit ? this.formEditRow.f_Id : "",
          isEdit: this.formEdit,
        });
        if (res) {
          const msg = this.formEdit ? "更新成功!" : "新增成功!";
          this.$message({
            type: "success",
            message: this.$t(msg),
          });
          this.loadTableData();
          this.formVisible = false;
        }
      }
      hideLoading();
    },

    handleShowForm(text) {
      this.formTitle = text;
      this.formVisible = true;
    },
    async handleOpenedForm(showLoading, hideLoading) {
      if (this.formEdit) {
        showLoading("加载数据中...");
        await this.$refs.form.loadFormData({ keyValue: this.formEditRow.f_Id });
        hideLoading();
      }
    },
    handleCloseForm() {
      this.$refs.form.resetForm();
    },

    async loadProcessId() {
      const data = await this.$awaitWraper(
        api.getFormalBySupplier(this.supplierId)
      );
      if (data) {
        return data.f_Id;
      }
      return "";
    },
  },
};
</script>